<template>
	<el-dialog v-model="props.dialogVisible" title="新增图书" width="30%"  center @close="dialogClose">
		<el-form label-position="right" label-width="100px" :model="props.fromData" style="max-width: 460px">
			<el-form-item label="图书名称">
				<el-input v-model="props.fromData.name" />
			</el-form-item>

			<el-form-item label="图书类型">
				<el-input v-model="props.fromData.type" />
			</el-form-item>

			<el-form-item label="图书描述">
				<el-input v-model="props.fromData.description" />
			</el-form-item>
		</el-form>
		<template #footer>
			<span class="dialog-footer">
				<el-button @click="dialogClose">取消</el-button>
				<el-button type="primary" @click="submit"> 提交 </el-button>
			</span>
		</template>
	</el-dialog>
</template>

<script lang="ts">
	import { defineComponent } from 'vue'

	export default defineComponent({
		name: 'DialogT',
		props: {
			fromData: {
				type: Object,
				required: true
			},

			dialogVisible: {
				type: Boolean,
				requeired: true
			}
		},

		setup(props, context) {
			const dialogClose = () => {
				context.emit('close')
			}

			const submit = () => {
				context.emit('submit')
			}
			return { props, dialogClose, submit }
		}
	})
</script>

<style scoped lang="scss"></style>
